<template>
  <div class="prd-more">
    <div class="prd-more-tt">
      更多商品
    </div>
    <div class="prd-more-box">
      <div class="prd-more-item">
        <div class="prd-more-item-img">
          <img src="@/assets/imgs/prd/prd_01.png"
               alt="商品图">
        </div>
        <div class="prd-more-item-tt">
          SARS-CoV-2 N蛋白IgG抗
          体检测试剂盒(纳米等离子技术
        </div>
        <div class="prd-shop-btn m-center">
          加入购物车
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {}
  },
}
</script>

<style lang="scss" scoped>
@import '@/theme/mixin.scss';
.prd-more {
  width: 200px;
  margin-left: 34px;
  &-tt {
    height: 20px;
    color: #0e1b2f;
    font-size: 16px;
    font-weight: 900;
    margin-bottom: 20px;
  }
  &-item {
    border-radius: 12px;
    border: 1px solid #dedede;
    padding-bottom: 20px;
    overflow: hidden;
    &-img {
      margin-bottom: 22px;
      img {
        display: block;
        width: 200px;
        height: 200px;
      }
    }
    &-tt {
      margin-bottom: 22px;
      color: #0e1b2f;
      font-size: 14px;
      padding: 0 22px;
      @include toverflow(2);
    }
    .m-center {
      margin: 0 auto;
    }
  }
}
</style>